import { createApp, h } from 'vue'
import Dialog from './Dialog.vue'

export const openDialog = (opts) => {
  const { title, content, ok, cancel, closeOnClickOverlay } = opts;
  const div = document.createElement('div')
  document.body.appendChild(div)
  const close = () => {
    dialog.unmount()
    div.remove()
  }
  const dialog = createApp({
    render() {
      return h(Dialog, {
        visible: true,
        'onUpdate:visible': (newVisible) => {
          if (newVisible === false) {
            close()
          }
        },
        closeOnClickOverlay,
        ok,
        cancel,
      }, {
        title,
        content,
      })
    }
  })
  dialog.mount(div)
}